<template>
	<detailbox title="查看"  @leftclick="close">
		<div slot="right" class="flex_item flex_between">
			<div class="warn_f gosign f12" v-if="detail.processStatus == 0 && detail.createUser == userInfo.user_id">请前往APP端，进行签名操作</div>
			<div v-else-if="detail.processStatus == 6 || detail.processStatus == 4" class="error error_f f12 ml10 p5">
			  <i class="f14 el-icon-error"></i>
			 审核未通过: <span class="ml30">{{ checkItem.type==1?'审核人:':checkItem.type==3?'记录责任人:':checkItem.type==4?'批准人:':'' }}  {{checkItem.createUserName}}</span> <span class="ml30">未通过原因: {{checkItem.content}}</span>  
			</div>
			<div v-else></div>
			<div class="">
				<el-button type="primary" size="small" plain @click="openDialg('print')">打印</el-button>
				<el-button type="primary" size="small" plain @click="openDialg('showhistory')">审批历史详情</el-button>
			</div>
		</div>
		<el-row class="mt10">
			<el-col :span="12">
				<basic-container>
					<div class="main_title success_f"><b>管理信息</b></div>
					<el-divider></el-divider>
					<div class="mb20">
						<span class="index_num success_bg">1</span>
						<b class="f14">基础信息</b>
					</div>
					<table class="table1 owntable mb20 tableLayout" border="0" cellspacing="0" cellpadding="1" width="100%">
					  <tr>
					    <td width="150">设计开发输出管理编号</td>
					    <td>{{ detail.number }}</td>
					    <td width="150">设计开发计划管理编号</td>
					    <td>{{ detail.processName }}</td>
					  </tr>
					  <tr>
					    <td>产品名称</td>
					    <td>{{ detail.productName }}</td>
					    <td>规格型号</td>
					    <td>{{ detail.skus }}</td>
					  </tr>
					  <tr>
					    <td>产品编号</td>
					    <td>{{ detail.code }}</td>
					    <td>管理部门</td>
					    <td>{{ detail.manageDeptName }}</td>
					  </tr>
					  <tr>
					    <td>负责人</td>
					    <td>{{ detail.manageUserName }}</td>
					    <td>编制部门</td>
					    <td>{{ detail.createDeptName }}</td>
					  </tr>
					  <tr>
					    <td>检验设备</td>
					    <td colspan="3">{{ detail.isUser == 0 ? '无' : '有' }}</td>
					  </tr>
					</table>

					<table class="table1 owntable mb20 tableLayout" border="0" cellspacing="0" cellpadding="1" width="100%" v-if="detail.deviceList.length!=0">
					  <tr>
					    <td>设备名称</td>
					    <td class="gray_bg">设备型号</td>
					    <td>设备编号</td>
					  </tr>
					  <tr v-for="(v, i) in detail.deviceList" :key="i">
					    <td>{{ v.deviceName }}</td>
					    <td class="gray_bg">{{ v.deviceModel }}</td>
					    <td>{{ v.deviceNumber }}</td>
					  </tr>
					</table>

					<work-file :detail="detail"></work-file>
				</basic-container>
			</el-col>
			<el-col :span="12">
				<process-record :guifanFilesProcessRecordList="guifanFilesProcessRecordList" :shenheNum="shenheNum"></process-record>
			</el-col>
		</el-row>
		<steps ref="steps"></steps>
		<showhistory ref="showhistory" type="1" :guifanFilesProcessRecordList="guifanFilesProcessRecordList"></showhistory>
		<work-print ref="print" :detail="detail"></work-print>
	</detailbox>
</template>

<script>
import { getguifanDetail } from '@/api/myapi/tixiwenjian';
export default {
	props: {
		detailId: ''
	},
	data() {
		return {
			system: 'developmentoutputprocess',
			radio: '',
			checked: false,
			showpreview: false,
			tableData: [],
			useTemp: false,
			form: {},
			options: [],
			guifanFilesProcessRecordList: [],
			detail: {},
			shenheNum: 0
		};
	},
	created() {
		this.getDetail();
	},
	methods: {
		close() {
			this.$emit('close');
		},
		getDetail() {
			getguifanDetail(
				{
					id: this.detailId
				},
				this.system
			).then(({ data }) => {
				if (data.success) {
					this.detail = data.data;
					this.shenheNum = data.data.processRecordList.length;
					this.guifanFilesProcessRecordList = data.data.processRecordList;
					this.checkItem = this.guifanFilesProcessRecordList.find(item=>item.checkStatus==2);
				}
			});
		}
	}
};
</script>

<style lang="scss">
.active {
	background-color: #e6f1fc !important;
	color: #126bc9;
}

.gosign {
	line-height: 30px;
	background: #fbf4e0;
	border: 1px solid #f3dea4;
	opacity: 1;
	border-radius: 2px;
	padding: 0 10px;
	margin-left: 30px;
}
</style>
